<!DOCTYPE html>
<html>

<head>
    <#include "/xhc/admin/components/meta.html" />
    <title>出出帮火车奇妙世界后台 ${metaTitleSuffix!}</title>
    <#include "/xhc/admin/components/stylesheets.html" />
    <style>
        .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>
</head>

<body>
    <div id='app'>
        <el-container>
            <#assign menuIndex="1-1" />
            <#include "/xhc/admin/components/menu.html" />
            <el-container>
                <#include "/xhc/admin/components/header.html" />
                <el-main>
                    <template>
                        <el-form ref="form" :model="form" label-width="80px">
                            <el-row :gutter="20">
                                <el-col :span="24">
                                    <el-form-item label="日期">
                                        <el-date-picker v-model="date" type="daterange" placeholder="日期" format='yyyy-MM-dd' value-format='yyyy-MM-dd'>
                                        </el-date-picker>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="24">
                                    <el-form-item label="时间">
                                        <el-time-select placeholder="起始时间" v-model="startTime" :picker-options="{start: '00:00', step: '01:00',end: '23:00'}" value-format='HH:mm'>
                                        </el-time-select>
                                        <el-time-select placeholder="结束时间" v-model="endTime" :picker-options="{start: '00:00',step: '01:00',end: '23:00',minTime: startTime}" value-format='HH:mm'>
                                        </el-time-select>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="24">
                                    <el-form-item label="名称">
                                        <el-checkbox-group v-model="checkList">
                                            <el-checkbox label="1">星期一</el-checkbox>
                                            <el-checkbox label="2">星期二</el-checkbox>
                                            <el-checkbox label="3">星期三</el-checkbox>
                                            <el-checkbox label="4">星期四</el-checkbox>
                                            <el-checkbox label="5">星期五</el-checkbox>
                                            <el-checkbox label="6">星期六</el-checkbox>
                                            <el-checkbox label="7">星期日</el-checkbox>
                                        </el-checkbox-group>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="名称">
                                        <el-input v-model="form.title"></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="提示">
                                        <el-input v-model="form.tips"></el-input>
                                    </el-form-item>
                                </el-col>
                                <!-- <el-col :span="8">
                                    <el-form-item label="折扣">
                                        <el-input v-model="form.discount"></el-input>
                                    </el-form-item>
                                </el-col> -->
                                <el-col :span="8">
                                    <el-form-item label="价格(元)">
                                        <el-input v-model="form.price1"></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="人数限制(人)">
                                        <el-input v-model="form.limit" type='number'></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="车票状态">
                                        <el-radio v-model="form.disable" label="0" border size="medium">售票</el-radio>
                                        <el-radio v-model="form.disable" label="1" border size="medium">暂停售票</el-radio>
                                    </el-form-item>
                                </el-col>
                                <el-col>
                                    <el-form-item>
                                        <el-button type="primary" @click="onSubmit">保存</el-button>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-form>
                    </template>
                </el-main>
            </el-container>
        </el-container>
        <#include "/xhc/admin/components/footer.html" />
    </div>
    <#include "/xhc/admin/components/scripts.html" />
    <script type="text/javascript">
    var vue = new Vue({
        el: '#app',
        data() {
            return {
                startTime: '00:00',
                endTime: '23:00',
                date: ['${today!}', '${today!}'],
                imgDatas: [],
                fileList2: [],
                dialogImageUrl: '',
                dialogVisible: false,
                images: [],
                imageUrl: null,
                form: {
                    checkList: [],
                    title: '',
                    price1: '60',
                    limit: 100,
                    disable: '0'
                },
                checkList: ['1', '2', '3', '4', '5', '6', '7']
            }
        },
        mounted: function() {

        },
        methods: {
            onSubmit() {
                var week = ''
                console.log(this.checkList)
                for (var idx = 0; idx < this.checkList.lenght; idx++) {
                    week = week + this.checkList[idx] + ';'
                }
                var param = {
                    startTime: this.startTime,
                    endTime: this.endTime,
                    startDate: this.date[0] + ' 00:00:00',
                    endDate: this.date[1] + ' 23:59:59',
                    week: week,
                    title1: this.form.title,
                    limit: this.form.limit,
                    price1: this.form.price1,
                    disable: this.form.disable,
                    tips: this.form.tips,
                    discount: this.form.discount
                }
                // console.log(param)
                var url = ''
                var ref = '${referer!""}'
                var url = '/xhc/web/ticket/submit'
                axiosRequest(param, url, ref)
            }
        },
        filters: {
            fmt(date) {
                return date
            }
        }
    })
    </script>
    <script>
    // vue.tableData = ${items!};
    </script>
</body>

</html>